<!-- 公告 -->
<template>
   <div class="notice">
      <el-collapse>
         <el-collapse-item>
            <template slot="title" >
               <div class="title_arr">
                  <div class="title_left">
                     <div style="color:#6464f7;"><i class="el-icon-tickets"></i>公告</div>
                     <el-divider direction="vertical"></el-divider>
                     <i>私信管理活动开始啦!立马参与活动，解锁高效运营方案</i>
                  </div>
                  <div class="title_right">
                     展开
                  </div>
               </div>
            </template>
            <div>与现实生活一致：与现实生活的流程、逻辑保持一致，遵循用户习惯的语言和概念；</div>
            <div>在界面中一致：所有的元素和结构需保持一致，比如：设计样式、图标和文本、元素的位置等。</div>
         </el-collapse-item>
      </el-collapse>
   </div>
</template>
<script>

</script>
<style lang='less'>
.notice{
   margin: 0 20px;
   box-sizing: border-box;
   .el-collapse,.el-collapse-item__wrap,.el-collapse-item__header{
      border:none
   }

   .el-collapse-item__header{
      font-weight: 700;
      font-size: 14px;
   }
   
   .title_arr{
      display: flex;
      height: 100%;
      width: 100%;
      justify-content: space-between;
      .title_left{
         display: flex;
         align-items: center;
      }
      .title_right{
         font-weight: 500;
         color: #9f9f9f;
      }
   }
}
</style>